<!--
 * @Author: HZH
 * @Date: 2021-09-17 16:11:47
 * @LastEditors: HZH
 * @LastEditTime: 2021-09-23 17:14:08
 * @Description: 
-->
<template>
  <div class="bg">
    <Header></Header>
    <div class="content">
      <div class="wrapper">
        <div class="title">{{artData.title}}</div>
        <div class="detailMes">
          
        </div>
        <div class="artcontent" v-html="artData.content">

        </div>
      </div>
    </div>
    <Footer></Footer>
  </div>
</template>

<script>
import Header from "./components/Header.vue";
import Footer from "./components/Footer.vue";
import { get } from "../utils/request";
  export default {
    components: {
    Header,
    Footer,
  },
    data() {
      return {
        articleItem:{},
        artData:{}
      }
    },
    methods: {
      getArtContent(){
        get('/index/article/findById',{id:this.articleItem.id}).then(res =>{
          this.artData = res.data
        })
      }
    },
    created(){
      this.articleItem = this.$route.query;
      this.getArtContent()
    }
  }
</script>

<style lang='scss' scoped>
  .bg{
    background: url("../../public/新建画布1.png") no-repeat;
    // width: 100%;
    background-size: 100% 100%;
    // height: 3000px;
    .content{
      .wrapper{
        background-color: #fff;
        color: #333;
        border-radius: 5px;
        margin-top: 25px;
        padding: 20px;
        .title{
          // margin: 0 auto;
          // color: rebeccapurple;
          font-weight: bold;
          font-size: 20px;
          border-bottom: 1px solid #eee;
          padding-bottom: 15px;
        }
      }
    }
  }
</style>